<!-- eslint-disable no-undef -->
<template>
  <div style="background: aliceblue;position:relative;">
    <!-- <callRoom ref="callRoom"/> -->
    <!-- <answerService ref="answerService"/> -->
    <div class="topBox">
      <div style="font-weight:700;font-size:20px;margin-left:30px;color:#43a3dc;">V2.9</div>
      <div class="name">{{UserName}}</div>
      <div class="topLeft">
        <div class="currentTime">{{ currentTime }}</div>
        <div class="currentBottom">{{ currentDate }} {{ currentWeek }}</div>
      </div>
      <div class="topIcon" @click="logout">
        <img src="../../assets/images/home/tuichu.png" />
      </div>
    </div>
    <div class="boxandchat">
      <div
        :class="{
          homebox: !showchat || !showList.AutoChat,
          // 调试模式不显示日志列表/ 开发模式
          homeboxDecrease: showchat && showList.AutoChat ,
          // homeboxDecrease0: showchat && !btnDebug,
          // 调试模式显示日志列表
          homeboxDecrease0: showchat && showlog && btnDebug,
        }"
      >
        <!-- <div class="blockBoxfirst"> -->
        <div
          :class="{
            block: !showchat || !showList.AutoChat,
            // 调试模式显示日志列表
            blockDecrease: showchat && showlog && showList.AutoChat && btnDebug,
            // 调试模式不显示日志列表/ 开发模式
            blockMiddle: showchat && !showlog || !btnDebug && showchat,
            blockLeft1: true,
          }"
          v-if="showList.CallService"
          @click="callClick"
        >
          <div class="textBox">
            <div class="textTitle">一键呼叫</div>
            <div>呼叫客服 提出您的问题</div>
          </div>
        </div>
        <div
          :class="{
            block: !showchat || !showList.AutoChat,
            blockDecrease: showchat && showlog && showList.AutoChat && btnDebug ,
            blockMiddle: showchat && !showlog || !btnDebug && showchat,
            blockRight1: true,
          }"
          v-if="showList.VideoConsult"
          @click="consultationClick"
        >
          <div class="textBox">
            <div class="textTitle">专家问诊</div>
            <div>预约对症专家在线二次诊疗</div>
          </div>
        </div>
        <!-- </div> -->
        <!-- <div class="blockBox"> -->
        <div
          :class="{
            block: !showchat || !showList.AutoChat,
            blockDecrease: showchat && showlog && showList.AutoChat && btnDebug ,
            blockMiddle: showchat && !showlog || !btnDebug && showchat,
            blockLeft2: true,
          }"
          v-if="showList.HealthRecord"
          @click="healthTreordClick"
        >
          <div class="textBox">
            <div class="textTitle">健康档案</div>
            <div>查看您的健康档案</div>
          </div>
        </div>
        <div
          :class="{
            block: !showchat || !showList.AutoChat,
            blockDecrease: showchat && showlog && showList.AutoChat && btnDebug ,
            blockMiddle: showchat && !showlog || !btnDebug && showchat,
            blockRight2: true,
          }"
          v-if="showList.SleepStatistics"
          @click="sleepClick"
        >
          <div class="textBox">
            <div class="textTitle">睡眠统计</div>
            <div>记录下每天的睡眠情况</div>
          </div>
        </div>
        <!-- </div> -->
        <!-- <div class="blockBoxlast"> -->
        <div
          :class="{
            block: !showchat || !showList.AutoChat,
            blockDecrease: showchat && showlog && showList.AutoChat && btnDebug ,
            blockMiddle: showchat && !showlog || !btnDebug && showchat,
            blockLeft3: true,
          }"
          v-if="showList.PhysiologicalMonitoring"
        >
        <!--
          <div class="textBox">
            <div class="textTitle">生理检测</div>
            <div>设备测量数据</div>
          </div>
          -->
          <div class="textBox">
            <div class="textTitle">实时监护</div>
            <div>设备测量数据</div>
          </div>
        </div>
        <div
          :class="{
            block: !showchat || !showList.AutoChat,
            blockDecrease: showchat && showlog && showList.AutoChat && btnDebug ,
            blockMiddle: showchat && !showlog || !btnDebug && showchat,
            blockRight3: true,
          }"
          v-if="showList.nightcare"
          style="background-color: aliceblue"
          @click="nightCareClick"
        >
          <div class="textBox">
            <div class="textTitle">夜间看护</div>
            <div>实时展示夜间在离床数据</div>
          </div>
        </div>
        <!-- </div> -->
        <!-- <div class="blockBoxlastNew"> -->
        <div
          :class="{
            block: !showchat || !showList.AutoChat,
            blockDecrease: showchat && showlog && showList.AutoChat && btnDebug ,
            blockMiddle: showchat && !showlog || !btnDebug && showchat,
            blockLeft4: true,
          }"
          @click="speechServiceClick"
          v-if="showList.VoiceService"
        >
          <div class="textBox">
            <div class="textTitle">语音服务</div>
            <div>实时语音服务</div>
          </div>
        </div>
        <div
          :class="{
            block: !showchat || !showList.AutoChat,
            blockDecrease: showchat && showlog && showList.AutoChat && btnDebug ,
            blockMiddle: showchat && !showlog || !btnDebug && showchat,
            blockRight4: true,
          }"
          @click="onlinechatClick"
          v-if="showList.AutoChat"
          style="background-color: aliceblue"
        >
          <div class="textBox">
            <div class="textTitle">自主对话</div>
            <div>实现与老人自主对话聊天，陪聊服务</div>
          </div>
        </div>
        <div
          :class="{
            block: !showchat || !showList.AutoChat,
            blockDecrease: showchat && showlog && showList.AutoChat && btnDebug ,
            blockMiddle: showchat && !showlog || !btnDebug && showchat,
            blockLeft5: true,
          }"
          @click="updateReocrdsClick"
          v-if="showList.My"
          style="background-color: aliceblue"
        >
          <div class="textBox">
            <div class="textTitle">我的</div>
            <div>展示最近的更新记录</div>
          </div>
        </div>
        <div
          :class="{
            block: !showchat || !showList.AutoChat,
            blockDecrease: showchat && showlog && showList.AutoChat && btnDebug ,
            blockMiddle: showchat && !showlog || !btnDebug && showchat,
            blockRight5: true,
          }"
          v-if="showList.configuration"
          style="background-color: aliceblue"
          @click="callConfigClick"
        >
          <div class="textBox">
            <div class="textTitle">配置</div>
            <div>配置音视频相关参数</div>
          </div>
        </div>
        <div
          :class="{
            block: !showchat || !showList.AutoChat,
            blockDecrease: showchat && showlog && showList.AutoChat && btnDebug ,
            blockMiddle: showchat && !showlog || !btnDebug && showchat,
            blockLeft6: true,
          }"
          v-if="showList.AIChat"
          style="background-color: aliceblue"
          @click="AIChatClick"
        >
          <div class="textBox">
            <div class="textTitle">AI语音互动</div>
            <div>实时对话式AI</div>
          </div>
        </div>
        <!-- </div> -->
      </div>
      <!-- 对话悬浮框 -->
      <div class="home" v-if="showList.AutoChat">
        <chat :logoutBtn="false" :showchat="showchat" v-show="showchat" ref="chatref" @transmit="getShowlog">
          <template #reduceandenlarge>
            <img
              @click="changeChatShow"
              class="reduce"
              src="../../assets/images/global/reduce.png"
            />
          </template>
        </chat>
        <img
          @click="changeChatShow"
          v-show="!showchat"
          class="enlarge"
          src="../../assets/images/home/chat.png"
        />
      </div>
    </div>
    <div class="awakenIcon" @click="awaken">
        <img src="../../assets/images/home/awaken.png" />
    </div>

  </div>
</template>

<script src="https://lf-cdn.coze.cn/obj/unpkg/flow-platform/chat-app-sdk/1.2.0-beta.10/libs/cn/index.js"></script> 
<script>

import axios from 'axios';
import { mapState } from "vuex";
import { genTestUserSig } from "../../../public/debug/GenerateTestUserSig";
import { getPermissions,getToken } from "@/api/index.js";
import chat from "../online-chat/index.vue";
import { chatMessage } from "../../api/index";
import Cookies from 'js-cookie'
// import callRoom from "@/components/call-room/index.vue";
//import answerService from "@/components/answer-service/index";
export default {
  name: "HomeBox",
  components: {
    chat,
    // callRoom,
    //answerService
  },
  computed: mapState({
    loginUserInfo: (state) => state.loginUserInfo,
    userInfoDetails: (state) => state.userInfoDetails,
    currentUserId: (state) => state.currentUserId,
    token: (state) => state.token
  }),
  data() {
    return {
      btnDebug: false,
      enableEditName: true,
      currentTime: new Date().Format("hh:mm"),
      currentDate: new Date().Format("MM月dd日"),
      currentWeek: this.getWeekDay(),
      showchat: false, //聊天框是否展示
      showlog: true, //日志列表是否展示
      showList: {
        CallService: false,
        VideoConsult: false,
        HealthRecord: false,
        SleepStatistics: false,
        PhysiologicalMonitoring: false,
        VoiceService: false,
        AutoChat: false,
        configuration: false,
        My:false,
        // shownightcare:false
        nightcare:true,
        AIChat:true
      },
      authorityData: {
        CallService: {
          action: {
            create: 1,
            update: 1,
            delete: 1,
            view: 1,
          },
          attribute: {
            name: "一键呼叫",
          },
          module: {
            id: "101",
          },
        },
        VideoConsult: {
          action: {
            create: 1,
            update: 1,
            delete: 1,
            view: 1,
          },
          attribute: {
            name: "视频问诊",
          },
          module: {
            id: "102",
          },
        },
        HealthRecord: {
          action: {
            create: 1,
            update: 1,
            delete: 1,
            view: 1,
          },
          attribute: {
            name: "健康档案",
          },
          module: {
            id: "103",
          },
        },
        SleepStatistics: {
          action: {
            create: 1,
            update: 1,
            delete: 1,
            view: 1,
          },
          attribute: {
            name: "睡眠统计",
          },
          module: {
            id: "104",
          },
        },
        PhysiologicalMonitoring: {
          action: {
            create: 1,
            update: 1,
            delete: 1,
            view: 1,
          },
          attribute: {
            name: "生理监测",
          },
          module: {
            id: "105",
          },
        },
        VoiceService: {
          action: {
            create: 1,
            update: 1,
            delete: 1,
            view: 1,
          },
          attribute: {
            name: "语音服务",
          },
          module: {
            id: "106",
          },
        },
        AutoChat: {
          action: {
            create: 1,
            update: 1,
            delete: 1,
            view: 1,
          },
          attribute: {
            name: "自主对话",
          },
          module: {
            id: "107",
          },
        },
        configuration: {
          action: {
            create: 1,
            update: 1,
            delete: 1,
            view: 1,
          },
          attribute: {
            name: "配置",
          },
          module: {
            id: "108",
          },
        },
        My: {
          action: {
            create: 1,
            update: 1,
            delete: 1,
            view: 1,
          },
          attribute: {
            name: "我的",
          },
          module: {
            id: "109",
          },
        },
        nightcare: {
          action: {
            create: 1,
            update: 1,
            delete: 1,
            view: 1,
          },
          attribute: {
            name: "夜间看护",
          },
          module: {
            id: "110",
          },
        },
        AIChat: {
          action: {
            create: 1,
            update: 1,
            delete: 1,
            view: 1,
          },
          attribute: {
            name: "实时对话",
          },
          module: {
            id: "111",
          },
        }
      },
      UserName:'',
      cozeWebChat: null,
      // isShowCoze: false,
      cozeaccesstoken: null
    };
  },
  created() {
    this.UserName = this.userInfoDetails.residents[0].userName;
    // 是否显示调试模式
    if (Cookies.get("modeSelected") == "1") {
      this.btnDebug = true;
    }
    this.getPermission();
  },
  mounted() {
    if (Cookies.get("modeSelected") == "1"){
      this.showchat = true;
    } 
    if(localStorage.getItem("ttsSelectedValue") !== "jstts"){
      // 判断使用百度语音合成
      this.getToken()
    }
    // 加载CozeSDK
    // this.loadCozeSDK()
    // console.log('调用接口-----------------------------------------------');
    // this.getaccesstoken()
  },
  methods: {
    getShowlog(data){
      this.showlog = data
    },
    async getPermission() {
      // 获取权限
      try {
        const { data } = await getPermissions({
          accountName: this.userInfoDetails.account.tel,
        });
        if (data) {
          this.authorityData = JSON.parse(data.permission_json).items;
          console.log("权限数据", this.authorityData);
          for (let i in this.authorityData) {
            this.showList[i] = this.authorityData[i].action.view === 1;
          }
        }
      } catch (err) {
        (this.showList = {
          CallService: true,
          VideoConsult: true,
          HealthRecord: true,
          SleepStatistics: true,
          PhysiologicalMonitoring: true,
          VoiceService: true,
          AutoChat: true,
          configuration: true,
          My:true,
          nightcare:true,
          AIChat:true
        }),
          console.log("err", err);
      }
    },
    changeChatShow() {
      this.showchat = !this.showchat;
    },
    //点击音视频配置
    callConfigClick() {
      this.$router.push("call-config");
    },
    //点击睡眠
    sleepClick() {
      this.$router.push("sleep-report");
    },
    // 点击夜间看护
    nightCareClick() {
      //跳转到夜间看护页面
      this.$router.push("night-care");
    },
    //点击专家问诊
    consultationClick() {
      this.$router.push("consultation");
    },
    //点击健康档案
    healthTreordClick() {
      //跳转到健康档案页面
      this.$router.push("health-record");
    },
    // 点击语音服务
    speechServiceClick() {
      this.$router.push("speech-service");
    },
    //自主对话
    onlinechatClick() {
      this.$router.push("online-chat");
    },
    // 我的
    updateReocrdsClick(){
      this.$router.push("update-records");
    },
    // 点击实时对话
    AIChatClick(){
      this.$router.push("AI-chat");
    },
    //退出首页
    logout() {
      this.$confirm("此操作将退出网页, 是否继续?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          if(!localStorage.getItem("remeber")){
            //清空账号密码缓存
            localStorage.removeItem("phoneNumber");
            localStorage.removeItem("password");
          }

          //清空视频参数配置
          localStorage.removeItem("video_quanlity");
          localStorage.removeItem("noise_quanlity");
          localStorage.removeItem("coding_quanlity");          
          localStorage.setItem("modeSelected","0");

          //退出登录
          this.$store.commit("userLogoutSuccess");
          console.log('chat页面销毁')
          this.$refs.chatref.beforeDestroy();
          this.$store.commit("setChatClient", null);
          console.log('chat页面销毁完成')
          //退出房间
          this.$refs.callRoom.leaveRoom();
        })
        .catch(() => {
          // this.$message({
          //   type: 'info',
          //   message: '已取消删除'
          // });
        });
    },
    //获取周几信息
    getWeekDay() {
      var tempDate = new Date();
      var days = tempDate.getDay();
      let week;
      switch (days) {
        case 1:
          week = "星期一";
          break;
        case 2:
          week = "星期二";
          break;
        case 3:
          week = "星期三";
          break;
        case 4:
          week = "星期四";
          break;
        case 5:
          week = "星期五";
          break;
        case 6:
          week = "星期六";
          break;
        case 0:
          week = "星期日";
          break;
      }
      return week;
    },
    // 唤醒语音对话
    async awaken(){
      // 打开自主对话
      this.showchat = this.showchat ? this.showchat : !this.showchat;
      // 自动发送消息“你好”
      var param = {
        model_type: 1,
        role_type: 1,
        user_id: this.currentUserId,
        sender_type: 2,
        sender_id: this.loginUserInfo.userId,
        sender_name: this.userInfoDetails.account.name,
        chat_message: '你好',
        volume:50,
        remark:''
      };
      if(param.chat_message.length == 0) return false;
      console.log('发送消息',param)
      await chatMessage(param)
        .then((res) => {
          console.log("调用接口的结果", res);
          if (res.code == 0) {
            console.log("发送成功", res);

            this.$store.commit("setChatArray", {
              roletype: 1,
              time: new Date().Format("yyyy-MM-dd hh:mm:ss"),
              name: "我",
              message: '你好',
              flag: "success",
              modeltype:1,
              id:Date.parse(new Date())
            });
          } else {
            this.$store.commit("setChatArray", {
              roletype: 1,
              time: new Date().Format("yyyy-MM-dd hh:mm:ss"),
              name: "我",
              message: '你好',
              flag: "fail",
              modeltype:1,
              id:Date.parse(new Date())
            });

            this.$store.commit("setChatLog", {
              time: new Date().Format("yyyy-MM-dd hh:mm:ss"),
              content: "消息发送失败："+ res.code+"-"+res.message +"    当前token:"+window.localStorage["token"] +",当前token过期时间："+window.localStorage["expiration"],
            });
          }
          this.$refs.chatref.chat_context_item = ""
          document.getElementById("chat_context_item").value = "";
          this.$refs.chatref.updated();
        })
        .catch((error) => {
          console.log("获取失败", error);
          this.$store.commit("setChatArray", {
            roletype: 1,
            time: new Date().Format("yyyy-MM-dd hh:mm:ss"),
            name: "我",
            message: '你好',
            flag: "fail",
            modeltype:1,
            id:Date.parse(new Date())
          });

          this.$store.commit("setChatLog", {
            time: new Date().Format("yyyy-MM-dd hh:mm:ss"),
            content: "消息发送失败"+ error +"    当前token:"+window.localStorage["token"] +",当前token过期时间："+window.localStorage["expiration"],
          });
          this.$refs.chatref.chat_context_item = "";
          this.$refs.chatref.updated();
        });
    },
    //点击一键呼叫
    callClick: async function () {
      let rsid = this.userInfoDetails.residents[0].rsid;
      console.log("**************************", rsid);
      let TelNum = this.userInfoDetails.account.tel;
      const userSig = genTestUserSig(TelNum).userSig;
      this.$store.commit("setLoginUserInfo", {
        userId: TelNum,
        userSig,
      });
      // //登录 trtcCalling
      // this.$trtcCalling.login({
      //   userID: TelNum,
      //   userSig
      // });
      //this.$router.push('search-user');
      //this.$router.push('call-page');
      this.$router.push("select-type");
    },
    goto: function (path) {
      this.$router.push(path);
    },
    // 获取token
    async getToken() {
      // var AK='sQ9uefSvgne4Xfp3doLL7P7w'
      // var SK='g0XJx25CPk7KMcL8LubW90ugpIjfE57z'
      // axios({
      //       url:'https://aip.baidubce.com/oauth/2.0/token?grant_type=client_credentials&client_id=' + AK + '&client_secret=' + SK,
      //       method:'POST'
      //     }).then(
      //       response =>{
      //         console.log('获取token成功',response.data.access_token)
      //         this.token=response.data.access_token
      //       },
      //       error =>{console.log('失败了'+error);}
      // )
      var param={
        'AK':'c90dWNbHurMWPM1pad6ldYb0',
        'SK':'omQ4ok0x74yhyPVrnjrf6elTorSWKz7R'
      }
      // 获取token 
      await getToken(param)
        .then((res) => {
          if (res.status == 200) {
            console.log(res)
            this.$store.commit("setToken", res.data.access_token);
          } else {
            console.log("调用接口失败");
          }
        })
        .catch((error) => {
          console.log("获取失败", error);
        });
    },
    // 加载CozeSDK
    // loadCozeSDK() {
    //   // 动态创建 script 标签加载 Coze SDK
    //   const script = document.createElement('script');
    //   script.src =
    //     'https://lf-cdn.coze.cn/obj/unpkg/flow-platform/chat-app-sdk/1.2.0-beta.15/libs/cn/index.js';
    //   script.onload = () => {        
    //     // SDK 加载完成后初始化
    //       if (window.CozeWebSDK) {
    //         this.initCozeChat();

    //       } else {
    //         console.error('SDK 加载失败或未定义 CozeWebSDK');
    //       }
    //   };
    //   document.head.appendChild(script);
    // },
    // // 初始化coze智能体
    // initCozeChat() {
    //   // eslint-disable-next-line no-undef
    //   console.log('CozeWebSDK',CozeWebSDK);
    //   const btn = document.querySelector('.aiIcon')
    //   // eslint-disable-next-line no-undef
    //   if (CozeWebSDK) {        
    //     const cozeWebChat = new CozeWebSDK.WebChatClient({
    //       config: {
    //         botId: '7514524413467869203', // 替换为你的 Bot ID
    //       },
    //       auth: {
    //         type: 'token',
    //         token: this.cozeaccesstoken, // 替换为你的 Token
    //         onRefreshToken: () =>
    //           this.cozeaccesstoken, // 可选：刷新 Token
    //       },
    //       // 用户信息
    //       userInfo: {
    //           id: this.currentUserId,
    //           // url: 'https://lf-coze-web-cdn.coze.cn/obj/coze-web-cn/obric/coze/favicon.1970.png',
    //           nickname: this.UserName,
    //         },
    //       ui: {
    //         base: {
    //             icon: 'https://kh.tyzfchina.com.cn:8082/wx/xiaofubudong.png',
    //             layout: 'pc',
    //             zIndex: 1000,
    //             lang: 'zh-CN'
    //         },
    //         header: {
    //           isShow: true,
    //         },
    //         asstBtn: {
    //           isNeed: false,
    //         },
    //         footer: {
    //           isShow: false,
    //         },
    //         chatBot: {
    //           title: "小服同学",
    //           uploadable: true,
    //           width: 500,
    //           // width: 1000,
    //           el: document.getElementById('cozeChatBox'),
    //           isNeedAudio: true,
    //           onHide: () => {
    //             console.log('隐藏');
    //             this.isShowCoze = false
    //             console.log('this.isShowCoze',this.isShowCoze);
                
    //             // document.querySelector('.mask').style.display = "none"
    //             // document.getElementById('cozeChatBox').style.pointerEvents = "none"
    //           },
    //           onShow: () => {
    //             console.log('展示');
    //             this.isShowCoze = true
    //             console.log('this.isShowCoze',this.isShowCoze);
    //             // document.querySelector('.mask').style.display = "block"
    //             // document.getElementById('cozeChatBox').style.pointerEvents = "auto"
    //           },
    //         },
    //       },
    //     })

    //     btn.addEventListener('click',()=>{
    //       if (cozeWebChat) {
    //         console.log(this.isShowCoze,!this.isShowCoze);
            
    //         if(!this.isShowCoze){
    //           console.log('展示');
    //           cozeWebChat.showChatBot()
    //         }else{
    //           console.log('隐藏');
    //           cozeWebChat.hideChatBot()
    //         }
    //       }
    //     })
    //   } else {
    //     console.error('CozeWebSDK 未正确加载');
    //   }
    // },
    // // 获取access_token
    // async getaccesstoken(){
    //   try {
    //     const response = await axios.get(`https://tyzfbj.com/avatar/ai/coze/permission/oauth2/token?sessionName=${this.currentUserId}`, {
    //       headers: {
    //         'Authorization': 'Bearer nikoyose.851896333#'
    //       }
    //     });
    //     console.log('response',response)
    //     if(response.data.code !== 0){
    //       // 获取token失败
    //       this.cozeaccesstoken = 'pat_zs0OqhdHWsPhICZB7p89mfTmJwP37GWVO5FW5bo7TEJ5kXlUyx6i9ghd9XUIGYME'
    //     }else{
    //       this.cozeaccesstoken = JSON.parse(response.data.data).access_token
    //     }
    //     this.loadCozeSDK()
    //     console.log('响应数据---------------------------:', this.cozeaccesstoken);
    //   } catch (err) {
    //     console.error('请求失败:', err.response ? err.response.data : err.message);
    //   }
    // }
  },
};
</script>

<style scoped>
.boxandchat {
  display: flex;
  justify-content: space-between;
}
.homebox {
  display: flex;
  flex-wrap: wrap;
  /* justify-content: center; */
  padding: 0 9rem;
  align-items: center;
  background-color: aliceblue;
  /* margin-right: 5rem; */
  height: 80.5%;
}
/* 聊天框展示 */
.homeboxDecrease {
  display: flex;
  flex-wrap: wrap;
  padding: 0 3.5rem;
  /* justify-content: center; */
  align-items: center;
  background-color: aliceblue;
  height: 80.5%;
}
.homeboxDecrease0 {
  display: flex;
  flex-wrap: wrap;
  padding: 0 1.5rem;
  /* justify-content: center; */
  align-items: center;
  background-color: aliceblue;
  height: 80.5%;
}

.blockLeft {
  margin-right: 5rem;
}
.blockBoxfirst {
  height: 25%;
  display: flex;
  justify-content: center;
  /* margin-top: -2rem; */
}
.blockBox {
  height: 25%;
  display: flex;
  justify-content: center;
  margin-top: 2.2rem;
}
.blockBoxlastNew {
  height: 25%;
  display: flex;
  justify-content: center;
  margin-top: 2.5rem;
  padding-bottom: 2rem;
  width: 100%;
  background-color: aliceblue;
}
.blockBoxlast {
  height: 25%;
  display: flex;
  justify-content: center;
  margin-top: 2.2rem;
  width: 100%;
  background-color: aliceblue;
}
.block {
  width: 38rem;
  background-color: #aba2a2;
  font-size: 1rem;
  border-radius: 0.4rem;
  margin-bottom: 2.5rem;
  cursor: pointer;
}

.blockLeft1 {
  /* margin-right: 5rem; */
  background-image: url("../../assets/images/home/hujiao.png");
  background-repeat: no-repeat;
  background-size: cover;
  height: 12rem;
}
.blockLeft2 {
  /* margin-right: 5rem; */
  /* background-color: #78b77f; */
  background-image: url("../../assets/images/home/dangan.png");
  background-repeat: no-repeat;
  background-size: cover;
  height: 12rem;
}
.blockLeft3 {
  /* margin-right: 5rem; */
  /* background-color: #78b77f; */
  background-image: url("../../assets/images/home/shengliceliang.jpeg");
  background-repeat: no-repeat;
  background-size: cover;
  height: 12rem;
}
.blockLeft4 {
  /* margin-right: 5rem; */
  /* background-color: #78b77f; */
  background-image: url("../../assets/images/home/zhineng.jpg");
  background-repeat: no-repeat;
  background-size: cover;
  height: 12rem;
}
.blockLeft5 {
  /* margin-right: 5rem; */
  /* background-color: #78b77f; */
  background-image: url("../../assets/images/home/user.png");
  background-repeat: no-repeat;
  background-size: cover;
  height: 12rem;
}
.blockLeft6 {
  /* margin-right: 5rem; */
  /* background-color: #78b77f; */
  background-image: url("../../assets/images/home/AIchat.jpg");
  background-repeat: no-repeat;
  background-size: cover;
  height: 12rem;
}
.blockRight3 {
  /* background-color: #78b77f; */
  background-image: url("../../assets/images/home/nightcare.jpg");
  background-repeat: no-repeat;
  background-size: cover;
  height: 12rem;
}
.blockRight4 {
  background-image: url("../../assets/images/home/chat.jpg");
  background-repeat: no-repeat;
  background-size: cover;
  height: 12rem;
}
.blockRight1 {
  background-image: url("../../assets/images/home/wenzhen.png");
  background-repeat: no-repeat;
  height: 12rem;
  background-size: cover;
}
.blockRight2 {
  background-image: url("../../assets/images/home/zhinengjiance1.png");
  background-repeat: no-repeat;
  /* background-color: #e1be5b; */
  background-size: cover;
  height: 12rem;
}
.blockRight5 {
  background-image: url("../../assets/images/home/yinshipinpeizhi.jpeg");
  background-repeat: no-repeat;
  background-size: cover;
  height: 12rem;
}
.textBox {
  color: white;
  text-align: left;
  margin-left: 2rem;
  margin-top: 7.5rem;
  font-weight: bold;
}
.textTitle {
  font-size: 1.5rem;
  margin-bottom: 0.1rem;
  font-weight: bold;
}
.topBox {
  display: flex;
  position:relative;
  justify-content: space-between;
  padding-top: 2%;
  height: 9%;
}
.name{
  position:absolute;
  left:50%;
  translate: -50%;
  font-size:24px;
  font-weight:700;
  color:#000;
}
.topLeft {
  display: flex;
  margin-left: 9.5rem;
  line-height: 4rem;
}
.currentTime {
  font-size: 1.5rem;
  margin-right: 1.5rem;
  color: rgb(240, 248, 255);
}
.currentBottom {
  margin-top: 0.2rem;
  /* color: #8d8989; */
  font-size: 1rem;
  color: rgb(240, 248, 255);
}
.topIcon{
    position: fixed;
    z-index: 2;
    right: 10px;
    top: 30px;
}
.topIcon,
.topIcon img {
  width: 4rem;
  height: 4rem;
  margin-right: 0.5rem;
  margin-top:-0.3rem;
  cursor: pointer;
}

/* 文字唤醒按钮 */
.awakenIcon{
  position:fixed;
  /* margin-left: .5rem; */
  right:0.5rem;
  bottom:0.2rem;
  cursor: pointer;
}
.awakenIcon img {
  width: 5rem;
  height: 5rem;
  cursor: pointer;
}



/* 聊天框 */
.blockDecrease {
  width: 32rem;
  background-color: #aba2a2;
  font-size: 1rem;
  border-radius: 0.4rem;
  /* margin-bottom: 20px; */
  margin-bottom: 2.5rem;
}
.blockDecrease:nth-child(2n + 1) {
  margin-right: 1.5rem;
}
.block:nth-child(2n + 1) {
  margin-right: 5rem;
}
.blockMiddle {
  width: 36rem;
  background-color: #aba2a2;
  font-size: 1rem;
  border-radius: 0.4rem;
  margin-bottom: 2.5rem;
}
.blockMiddle:nth-child(2n + 1) {
  margin-right: 2.5rem;
}
.home {
  /* margin-right: 5px; */
  font-size: 0.73rem;
}
.home .reduce {
  height: 2rem;
  float: right;
  margin-top: 0.2rem;
  cursor: pointer;
}
.home .enlarge {
  position: fixed;
  top: 50%;
  transform: translateY(-25%);
  right: 0.5rem;
  height: 4rem;
  cursor: pointer;
}
.home /deep/ .chat_commento {
  width: 17.6rem;
  height: 35rem;
}
.home /deep/ .logList {
  height: 35rem;
}
.home /deep/ .chat_right_content,
.home /deep/ .chat_left_content {
  padding: 10px;
}
.home /deep/ .chat_right,
.home /deep/ .chat_left {
  margin: 5px 0 5px 0;
}
.home /deep/ .chat_right_item_2,
.home /deep/ .chat_left_item_2 {
  min-height: unset;
}
.home /deep/ #box {
  height: unset;
}
</style>
